@import (reference) "../../../node_modules/bootstrap/less/bootstrap.less";

input#edit-question-title, input#edit-group-title {
    .edit-question-title-fontstyle();
}

.dropdown-icon {
    display: inline-block;
    position: absolute;
    left: 0;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background-image: url(../i/icons4.png);
    background-position-x: 0;
    overflow: hidden;
}

.mono{
    font-family:monospace !important;
}

#main .ace_hidden-cursors {
  opacity: 0;
}

#main .ace_editor.ace_autocomplete .ace_completion-highlight {
    text-shadow: none;
}

#roster-editor .dropdown-with-breadcrumbs-and-icons,

.dropdown-with-breadcrumbs-and-icons {
    label {
        font-weight: normal;
        display: block;
        font-family: "Lucida Console", Monaco, monospace;
        font-size: 14px;
        color: #5d5d5d;
    }

    .linked-roster-source {
        margin-left: 0px;
        font-style: italic;
        font-family: Georgia, serif;
        font-weight: normal;
        color: @questionnaire-tree-roster-color;
    }

    .btn-group {
        width: 100%;

        .btn.dropdown-toggle {
            width: 100%;
            border: none;
        }

        .selected-item {
            white-space: normal;

            .path {
                color: @questionnarie-question-placeholder-color;
                display: block;
                text-transform: uppercase;
                font-size: 10px;
                font-weight: normal;
                margin-bottom: 10px;
            }

            .chosen-item {
                color: #555555;
                line-height: 20px;
                .arial-font();
                font-size: 14px;
                position: relative;
                padding-left: 29px;
                display: block;
                letter-spacing: normal;
                font-weight: normal;
            }

            .var-name-line {
                color: #3da802;
                font-weight: bold;
            }
        }

        .dropdown-arrow {
            top: 14px;
        }

        .selected-block {
            width: 100%;
            position: relative;
        }

        .var-block {
            position: absolute;
            margin: auto;
            top: 0;
            bottom: 0;
            right: 0;
            display: table;
            background-color: #fff;

            .var-name {
                color: #3da802;
                vertical-align: middle;
                display: table-cell;
            }

            &:before {
                @w: 75px;
                display: block;
                position: absolute;
                height: 100%;
                content: '';
                width: @w;
                top: 0px;
                left: -@w;
                #gradient > .horizontal(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 1.0));
            }

            &:hover {
                background-color: #f1f2f3;
            }
        }
    }

    .dropdown-menu {
        width: 100%;
        overflow-y: auto;
        max-height: 500px;
        //margin-top: -37px;
        .arial-font();
        border: none;

        li {
            padding-left: 5px;
            padding-right: 5px;

            span {
                padding-right: 5px;
                padding-left: 5px;
            }
        }

        li a {
            .arial-font();
            padding-top: 1px;
            padding-bottom: 1px;
            color: @questionnarie-question-editor-color;
            position: relative;
            padding-right: 5px;
            padding-left: 5px;
            margin-left: 10px;

            &.linked-question-source {
                margin-left: 0px;
                padding-right: 5px;
                padding-left: 20px;
            }

            &.linked-roster-source {
                margin-left: 0px;
                font-style: italic;
                font-family: Georgia, serif;
                font-weight: normal;
                padding-right: 5px;
                padding-left: 5px;
                color: @questionnaire-tree-roster-color;
            }

            i {
                position: relative;
            }

            &:after {
                @w: 50px;
                display: block;
                position: absolute;
                height: 100%;
                content: '';
                width: @w;
                top: 0;
                right: 0;
                z-index: 1010;
            }

            &:hover {
                background: #f1f2f3;
                border-radius: 4px;

                .var-block {
                    background-color: #f1f2f3;

                    &:before {
                        @w: 75px;
                        display: block;
                        position: absolute;
                        height: 100%;
                        content: '';
                        width: @w;
                        top: 0px;
                        left: -@w;
                        #gradient > .horizontal(rgba(241, 242, 243, 0.0), rgba(241, 242, 243, 1.0));
                    }
                }
            }
        }


        .dropdown-header {
            text-transform: uppercase;
            font-size: 10px;
            margin-top: 15px;
            line-height: 12px;

            &:first-child {
                margin-top: 0;
            }
        }
    }

    .select-placeholder {
        color: @questionnarie-question-placeholder-color;
    }
}
.question-editor .options-editor
{
    margin-top: 0;
    padding: 10px 15px;
    border-radius: 4px;


    .table-holder {
        display: table;
        width: 100%;

        .table-row {
            display: table-row;
            height: 38px;

            .column-2, .column-3, .column-35, .column-4 {
                padding-left: 0;
                padding-right: 0;
                display: table-cell;
                vertical-align: top;
            }

            .column-4 {
                width: 35px;
            }

            .column-2 {
                width: 100px;
                border-radius: 4px 0 0 4px;
            }

            .column-2 input {                
                box-shadow: none;
                .questionnarie-question-list-item-qname-fontstyle();
                font-size: 14px;
                .form-control-focus();
                &.has-error {
                    border-color: #a94442;
                    border-width: 2px;
                }
            }

            .column-3 input {
                border-color: #fff;
                box-shadow: none;
                .arial-font();
                .form-control-focus();
            }

            .column-35 {
               width: 150px;
                border-radius: 0 4px 4px 0;
            }
            .column-35 input {              
              box-shadow: none;
                .questionnarie-question-list-item-qname-fontstyle();
              font-size: 14px;
              .form-control-focus();
              &.has-error {
                border-color: #a94442;
                border-width: 2px;
              }
            }

            .column-4 {
                > a {
                    display: block;
                    background: url("../i/cross-red.png") center center no-repeat;
                    width: 34px;
                    height: 34px;
                }
            }
            input.border-right {
              border: 2px solid #fff;
              border-right-color: #f1f2f3;
            }
        }
    }

    p input#edit-question-save-button {
        margin-top: 15px;
    }
}

.question-editor {
    button#rosterTypeBtn, ul[aria-labelledby="rosterTypeBtn"] {
        width: 450px;
    }

    button#edit-roster-numeric-source, ul[aria-labelledby="edit-roster-numeric-source"] {
        width: 100%;
    }

    .checkbox-in-column {
        margin-top: 5px;
        white-space: nowrap;

        input.wb-checkbox + label {
            .lucida-console-font();
            color: #5d5d5d;
            font-size: 14px;
        }
    }

    .small-numeric-input {
        width: 80px !important;
    }

    .small-date-input {
        width: 128px !important;
        height: 34px !important;
        font-size: 14px !important;
        background-color: #eee !important;
    }

    .form-group.singleline-group {
        label,
        input {
            display: inline-block;
        }
    }

    .inline-inputs .form-group .form-control {
        display: inline-block;
        margin-left: 5px;
    }
}

.row .form-group {
    button.cross {
        display: block;
        background: url("../i/cross-red.png") center center no-repeat;
        width: 34px;
        height: 34px;
    }

     button.delete-btn-sm {
        background: url("../i/cross-red.png") center center no-repeat;
        width: 15px;
        height: 15px;
        .opacity(0.3);
        &:hover {
            .opacity(1);
        }
    }

     &.validation-group {
         background: #f1f2f3;
         padding: 16px;
         border-radius: 4px;
         margin-bottom: 4px;
         .delete-validation-condition {
             float: right;
         }
         .validation-message{
             margin-top: 18px;
         }
     }

    .btn-group button.dropdown-toggle {
        padding: 10px 40px 10px 10px;
        background-color: #ffffff;
        border: 2px solid #cccccc;
        text-transform: none;
        text-align: left;
        min-height: 37px;
        //width: 450px;
        > span.dropdown-arrow {
            background: url(../i/dropdown-arrow.png) no-repeat center center;
            width: 19px;
            height: 12px;
            position: absolute;
            right: 10px;
        }

        > span.edit-roster {
            display: inline-block;
            overflow: hidden;
            padding-left: 10px;
            width: 100%;
        }
    }
}

.dropdown-with-fixed-width {
    padding: 10px 40px 10px 10px;
    background-color: #ffffff;
    border: 2px solid #cccccc;
    text-transform: none;
    text-align: left;
    min-height: 37px;
    width: 220px;
    > span.dropdown-arrow {
        background: url(../i/dropdown-arrow.png) no-repeat center center;
        width: 19px;
        height: 12px;
        position: absolute;
        right: 10px;
    }
}



    .help-bracket {
        color: #bfd8ed;
    }

    .edit-question-note {
        font-family: "Helvetica Neue","Helvetica",Arial,sans-serif;
        font-size: 14px;
        color: #c1c7cb;
    }

    .roster-type-specific-block,
    .question-type-specific-block {
        background: @questionnarie-question-specific-block-color;
        padding: 8px;
        border-radius: 0 0 4px 4px;
        .clearfix();
    }

    #roster-editor {

        #rosterTypeBtn {
            border-color: @designer-editor-lightblue-bg-color;
        }

        .input-variable-name:before {
            top: 35px;
        }
    }

    #question-editor {
        .input-variable-name:before {
            top: 35px;
        }
    }

    textarea.form-control, textarea#edit-group-description {
        height: 37px;
        min-height: 37px;
    }

    #static-text-editor {
        #edit-static-attachment-name {
            color: #e004c9;
        }
    }
